/* CSS Document */
/* news-box */
.news-box{width:100%;height:auto;margin:10px auto 30px;padding:20px 0;}

/* news-box slide */
.htmleaf-container {width:360px;height:280px;float:left;margin:0 auto;text-align:center;overflow:hidden;}
 #slider {width:100%;height:240px;position:relative;overflow:hidden;}
@keyframes load {from {left:-100%;}
to {left:0;}
}
.slides {width:400%;height:100%;position:relative;-webkit-animation:slide 30s infinite;-moz-animation:slide 30s infinite;animation:slide 30s infinite;}
.slider {width:25%;height:100%;float:left;position:relative;z-index:1;overflow:hidden;}
.slide img {width:100%;height:100%;}
.slide img {width:100%;height:100%;}
.image {width:100%;height:100%;}
.image img {width:100%;height:100%;}
/* Legend */.legend {/*border:500px solid transparent;border-left:800px solid rgba(52,73,94,.7);*/border-bottom:0;position:absolute;bottom:0;}
/* Contents */.content {width:100%;height:100%;position:absolute;overflow:hidden;}
.content-txt {width:300px;height:100px;float:left;position:relative;top:90px;-webkit-animation:content-s 7.5s infinite;-moz-animation:content-s 7.5s infinite;animation:content-s 7.5s infinite;}
.content-txt h2 {font-family:Intro;font-size:18px;text-align:left;margin-left:15px;padding-bottom:10px;}
.content-txt h2 a{color:#fff;}
.content-txt p {font-family:Quicksand;font-weight:normal;font-size:14px;height:72px;overflow:hidden;font-style:italic;color:#fff;text-align:left;margin-left:15px;}
/* Switch */.switch {width:120px;height:10px;position:absolute;bottom:30px;z-index:99;left:15px;}
.switch > ul {list-style:none;}
.switch > ul > li {width:10px;height:10px;border-radius:50%;background:#cc0000;float:left;margin-right:5px;cursor:pointer;}
.switch ul {overflow:hidden;}
.on {width:100%;height:100%;border-radius:50%;background:#f39c12;position:relative;-webkit-animation:on 30s infinite;-moz-animation:on 30s infinite;animation:on 30s infinite;}
/* Animation */@-webkit-keyframes slide {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:-100%;}
46% {margin-left:-100%;}
50% {margin-left:-200%;}
71% {margin-left:-200%;}
75% {margin-left:-300%;}
96% {margin-left:-300%;}
}
@-moz-keyframes slide {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:-100%;}
46% {margin-left:-100%;}
50% {margin-left:-200%;}
71% {margin-left:-200%;}
75% {margin-left:-300%;}
96% {margin-left:-300%;}
}
@keyframes slide {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:-100%;}
46% {margin-left:-100%;}
50% {margin-left:-200%;}
71% {margin-left:-200%;}
75% {margin-left:-300%;}
96% {margin-left:-300%;}
}
@-webkit-keyframes content-s {0% {left:-420px;}
10% {left:0px;}
30% {left:0px;}
40% {left:0px;}
50% {left:0px;}
60% {left:0px;}
70% {left:0;}
80% {left:-420px;}
90% {left:-420px;}
100% {left:-420px;}
}
@-moz-keyframes content-s {0% {left:-420px;}
10% {left:0px;}
30% {left:0px;}
40% {left:0px;}
50% {left:0px;}
60% {left:0px;}
70% {left:0;}
80% {left:-420px;}
90% {left:-420px;}
100% {left:-420px;}
}
@keyframes content-s {0% {left:-420px;}
10% {left:20px;}
15% {left:0px;}
30% {left:0px;}
40% {left:0px;}
50% {left:0px;}
60% {left:0px;}
70% {left:0;}
80% {left:-420px;}
90% {left:-420px;}
100% {left:-420px;}
}
@-webkit-keyframes on {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:15px;}
46% {margin-left:15px;}
50% {margin-left:30px;}
71% {margin-left:30px;}
75% {margin-left:45px;}
96% {margin-left:45px;}
}
@-moz-keyframes on {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:15px;}
46% {margin-left:15px;}
50% {margin-left:30px;}
71% {margin-left:30px;}
75% {margin-left:45px;}
96% {margin-left:45px;}
}

/* about-box */
.about{width:calc(50% - 200px);float:left;margin:0px 6px;padding:0 5px;}
.about .about-img{width:100%;height:80px;overflow:hidden;}
.about .about-img img{width:100%;height:auto;}
.about p{font:300 13px/17px "Times New Roman",'microsoft yahei', serif;padding-top:5px;}
/*news-box  title-box */
.txt-news-box{width:calc(50% - 200px);height:280px;float:left;overflow:hidden;padding:0 5px;margin:0px 6px;}
.title {height:40px;line-height:40px;text-align:left;margin-bottom:20px;}
.title h2{width:100%;font-size:18px;font-weight:700;color:#333;line-height:40px;}
.title h2 span{float:right;font-size:14px;font-weight:300;}
.title h2 span a{text-decoration: none;}
.title h2 span a:after {content: ">>";padding-left:5px;font-size:14px;}
.txt-news-box li{width:calc(100% - 20px);float:left;border-bottom:dotted 1px #f0f0f0;font:100 13px/24px 'microsoft yahei', serif;color:#3f3b3a;}
.txt-news-box ul {margin:0px 0 5px;}
.txt-news-box ul li:nth-child(n+13){display:none;}
.txt-news-box li .news-con{width:100%;}
.txt-news-box li .introduce{width:100%;margin:5px 0;font:100 11px/16px 'microsoft yahei', serif;display:none;}
.txt-news-box li .news-title{width:auto;height:24px;overflow:hidden;float:left;}
.txt-news-box li span{float:right;}
.txt-news-box li a{color:#3f3b3a;text-decoration:none;float:left;}
.txt-news-box li .introduce .more{float:right;color:#e91e63;padding-right:5px;}


.hot-products{background:rgba(245,245,247,.9);padding:20px;margin:50px 0;} 
.hot-products-list{margin:30px 40px 0px;}
.hot-products-list li{float:left;width:calc(25% - 10px);height:auto;margin:0 5px 5px;padding:10px;}
.hot-products-list li h3{text-align:center;line-height:32px;height:32px;font-size:16px;overflow:hidden;}
.hot-products-list li h3 a{color:#3f3b3a;}
.hot-products-list li img{width:100%;height:auto;}

.products{background:#fff;padding:20px;margin:50px 0;} 
.products .products-list{width:100%;padding:15px 10px;}
.products .products-list a{color:#000;}
.products .products-list a:hover{color:#cc0000}
.products .products-list dt {width:20%;float:left;text-align:center;border-bottom:dotted 1px #f0f0f0;}
.products .products-list dt h3{/*border-bottom:dotted 1px #f0f0f0;*/font:300 16px/42px 'microsoft yahei', serif;}
.products .products-list dd{width:100%;font:300 13px/24px 'microsoft yahei', serif;display:none;}
 
.information{background:rgba(245,245,247,.9);padding:20px;margin:50px 0;} 
.information li a{color:#000;}
.information li a:hover{color:#cc0000}
.information li{width:calc(50% - 20px);float:left;margin:5px 10px;overflow:hieedn;}
.information li .info-img{width:35%;float:left;overflow:hidden;}
.information li .text-con{width:calc(65% - 8px);float:left;overflow:hidden;margin:0 0 0 8px;}
.information li .info-img img{width:100%;height:auto;}
.information li .text-con .news-title{width:100%;font:600 15px/28px 'microsoft yahei', serif;overflow:hidden;height:28px}
.information li .text-con .date{width:100%;font:200 12px/20px 'microsoft yahei', serif;border-top:dotted 1px #ccc;}
.information li .text-con .introduce{height:57px;overflow:hidden;font:200 14px/19px 'microsoft yahei', serif;}
.information li .text-con .more{float:right;padding:0 5px 0 0;font:800 13px/20px 'microsoft yahei', serif;color:#e91e63;}
@media only screen and (max-width:1024px) {
.txt-news-box{display:none;}	
.about{width:calc(100% - 375px);}
.about .about-img{width:100%;height:auto;overflow:hidden;}
}
@media only screen and (max-width:960px) {
.hot-products-list li{width:calc(50% - 10px);height:auto;}
.txt-news-box li .news-title{width:150px;height:36px;overflow:hidden;float:left;}
.news-list{width:100%;float:none;}
.news-list li {margin:15px 10px;}
	}
@media only screen and (max-width:900px) {
.title-box,.txt-news-box,.top-notes,.about{width: calc(100% - 30px);margin: 10px 15px;padding: 0px 0px 10px;}
	
.htmleaf-container {width: calc(100% - 30px);height:400px;margin: 10px  15px;}
 #slider {width:720px;height:480px;margin: 10px  calc(50% - 360px);}	
.content-txt {top:210px;}
.switch {bottom:150px;} 
.txt-news-box li{width:100%;}
.txt-news-box ul li:nth-child(even){margin:0;}
.txt-news-box{height:auto;}
.txt-news-box li .news-title{width:auto;}
}	

@media only screen and (max-width:768px) {	
.banner .banner-text-box{float:none;padding:10px 10px 30px;width:100%;height:auto;}
.banner .banner-img-box{float:none;width:100%;height:500px;overflow:hidden;}
.banner {margin:20px 0 5px;}
.banner .banner-text-box .contact{margin:20px 0 0 0;float:Left;width:160px;padding:0 15px;}
.banner .banner-text-box .learn{margin:20px 0 0 0;padding-left:30px;}
.products .products-list dt {width:50%;text-align:left;}
.products .products-list dt h3{/*border-bottom:dotted 1px #f0f0f0;*/font:900 16px/42px 'microsoft yahei', serif;}
.products .products-list dd{width:100%;font:300 13px/24px 'microsoft yahei', serif;display:block;}
.products .products-list dd ul{border-bottom:solid 1px #f0f0f0;margin:20px 0;}
.products .products-list dd ul li{width:33.33%;float:left;text-align:center;margin:0px auto 15px;}
.information li .info-img{width:100%;}
.information li .text-con{width:100%;margin:0;}
#slider {width:600px;height:400px;margin: 10px  calc(50% - 300px);}	
.content-txt {top:220px;} 
.switch {bottom:70px;}
.content-txt {top:210px;}
.switch {bottom:70px;}

.type-title-box{margin:5px calc(25% - 45px);}
.type-h3::before {left:32%;}
.hot-products .h2tlt{margin:30px 20px 20px;}
.hot-products-list{margin:30px 0px 0px;}
 
.hot-products-list li:nth-child(1),.hot-products-list li{width:100%;height:auto;margin:0 0px 20px;}
.hot-products{padding:15px;}
.technology{margin:15px auto 2px;}
.Knowledge-img-box{width:80%;margin:20px 10%;max-height:180px;}
.education p{font:500 14px/18px "Poppins", Helvetica, Arial, sans-serif;margin:20px;}
.application ul li:nth-child(1),.application ul li:nth-child(2),.application ul li:nth-child(3),.application ul li:nth-child(4),.application ul li:nth-child(5){width:calc(100% - 30px);margin:10px 15px;}
.superior{margin:20px auto;}
.superior .title-con,.superior .art-con{width:100%;}
.superior h2{padding:0 10%;font:800 24px/36px "Times New Roman",'microsoft yahei', serif; }
.superior .art-con p{padding:10px 5%;}	
.superior-more {font:500 16px/20px "Poppins", Helvetica, Arial, sans-serif;padding:30px 0px 20px 20px;}
.img-con{width:100%;height:auto;margin:30px 0;float:Left;}
.img-con img{width:80%;height:auto;margin:0 10%;}
.notes{padding:20px 0;}
}
@media only screen and (max-width:640px) {	
.type-h3::before {display:none;}
.type-h3:after{width:100%;border-bottom:2px solid rgba(245,245,247,1);left:0%;}
#slider {width:360px;height:240px;margin: 10px  calc(50% - 180px);}	
.products .products-list dt {width:100%;}
.products .products-list dd ul li{width:50%;float:left;text-align:center;margin:0px auto 15px;}
.content-txt {top:90px;} 
.switch {bottom:30px;}
.information li{width:calc(100% - 20px);}
}
@media only screen and (max-width:359px) {.type-title-box{margin:5px 30px;width:calc(100% - 60px);}
.banner .banner-text-box .contact{margin:20px calc(50% - 80px) 0;}
.banner .banner-text-box .learn{margin:20px calc(50% - 80px) 0;padding-left:0px;text-algin:center;}
.application ul li .con a{font:400 24px/30px Times, "Times New Roman",'microsoft yahei', serif;}
.h2tlt{font:600 24px/32px "Times New Roman",'microsoft yahei', serif;}

}